<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../favicon.ico">

    <title><?php echo $OJ_NAME?></title>  
    <?php include("template/$OJ_TEMPLATE/css.php");?>	    


    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body>

    <div class="container">
    <?php include("template/$OJ_TEMPLATE/nav.php");?>	    
      <!-- Main component for a primary marketing message or call to action -->
      <div class="jumbotron">
<center>

<table>
    <tr align='center' class='evenrow'>
        <td width='5'></td>
        <td  colspan='1'>
            <!--直接查看指定题目-->
            <form class=form-inline action=problem.php>
                <input class="form-control search-query" type='text' name='id'  placeholder="Problem ID">
                <button class="form-control" type='submit' >Go</button>
            </form>
        </td>
        <td width='15'></td>
        <td colspan='1'>
            <form class="form-search form-inline">
                <input type="text" name=search class="form-control search-query" placeholder="Keywords Title or Source">
                <button type="submit" class="form-control"><?php echo $MSG_SEARCH?></button>
            </form>
        </td>
    </tr>
</table>
<table id='problemset' width='90%'class='table table-striped'>
    <thead>
        <tr class='toprow'>
            <th width='5'></th>
            <th width='20'><?php echo $MSG_PROBLEM_ID?></th>
            <th><?php echo $MSG_TITLE?></th>
            <th width='12%'><?php echo $MSG_SOURCE?></th>
            <th class='hidden-xs' width=60><?php echo $MSG_LEVEL?></th>
            <th class='hidden-xs' style="cursor:hand" width=60 ><?php echo $MSG_AC?></th>
            <th class='hidden-xs' style="cursor:hand" width=60 ><?php echo $MSG_SUBMIT?></th>
        </tr>
    </thead>
    <tbody>
    <?php
        $isOdd = 1;
        foreach($view_problemset as $row){
            // 基数行和偶数行采用不同的样式
            if ( $isOdd ) {
                echo "<tr class='oddrow'>";
            }
            else {
                echo "<tr class='evenrow'>";
            }
            foreach($row as $table_cell){
                echo "<td>";
                echo $table_cell;
                echo "</td>";
            }
            echo "</tr>";
            $isOdd = !$isOdd;
        }
    ?>
    </tbody>
</table>

    <nav id="page" class="center">
        <ul class="pagination">
        <?php
            // 首页
            echo "<li class='page-item'><a href='problemset.php?page=1&search=".$searchParam."'>&lt;&lt;</a></li>";
            if( !isset($pageNo) ) {
                $pageNo = 1;
            }
            $pageNo = intval($pageNo);

            // 展示当前页面前后的8个页面
            $section = 6;
            $start = $pageNo - $section;
            if ( $start <= 0 ) {
                $start = 1;
            }

            $end = $pageNo + $section;
            if ( $end > $pageCnt ) {
                $end = $pageCnt;
            }
            $para = "search=".$searchParam;
            for ( $i = $start; $i <= $end; $i++ ) {
                $para .= "&page=".$i;
                echo "<li class='".($pageNo==$i?"active ":"")." page-item'>"
                            ."<a href='problemset.php?".$para."'>".$i."</a>"
                        ."</li>";
            }

            // 末页
            echo "<li class='page-item'><a href='problemset.php?page=".$pageCnt."&search=".$searchParam."'>&gt;&gt;</a></li>";
        ?>
        </ul>
    </nav>
</center>
</div>

    </div> <!-- /container -->


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <?php include("template/$OJ_TEMPLATE/js.php");?>	    
  <script type="text/javascript" src="include/jquery.tablesorter.js"></script>
<script type="text/javascript">
    /*
    $(document).ready(function() {
        $("#problemset").tablesorter();
    });
    */
</script>
</body>
</html>
